<!--
 * @Author: YuanYu
 * @Date: 2021-09-17 09:43:01
 * @LastEditors: YuanYu
 * @LastEditTime: 2021-09-17 10:44:24
 * @Description: 
-->
<template>
  <!-- 负责编写页面的结构 -->
  <!-- 只有一个div节点 -->
  <div>
    主页hi
    <!-- 插值语法 -->
    <div>{{ message }}{{swaper}}</div>
  </div>
</template>

<script>
// 引入get请求
import { get } from "../utils/request";
// 数据逻辑的交互处理
export default {
  data() {
    return {
      message: "hello Vue",
      swaper:[],
    };
  },
  // 方法
  methods: {
    // 发送网络请求 获取数据
    // 引入封装好的工具类 网络请求工具
    // 获取轮播图数据
    // ES6函数的简写方式
    getSwipersData() {
      // 发送get请求
      get("/index/carousel/findAll").then((res) => {
        console.log(res.data);
        this.swaper = res.data;
      });
    },
  },
  created() {
    // alert(111)
    // 在生命周期中调用methods中的方法
    this.getSwipersData();
  },
};
// 数据交互逻辑
// 1.在data中定义一个接收数据的容器
// 2.发送网络请求
// 3.
</script>